<!--
 * @Description: 
 * @Author: helei
 * @Date: 2021-05-29 09:08:40
 * @LastEditors: helei
 * @LastEditTime: 2021-06-05 15:58:36
-->
<template>
  <div class="hotCommodity">
    <div class="top">
      <div class="title">热门商品</div>
      <div class="showAll" @click="more">查看更多></div>
    </div>
    <div class="list">
      <div
        class="item"
        v-for="(item, index) in hotProList.slice(0, 8)"
        :key="index"
        @click="goDetail(item.id)"
      >
        <el-image :src="item.titlePicStr" />
        <div class="name">{{ item.productName }}</div>
        <div class="price">
          ￥{{ `${item.productPriceMin}-${item.productPriceMax}` }}
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  components: {},
  props: ["hotProList"],
  data() {
    return {};
  },
  watch: {},
  computed: {},
  methods: {
    more() {
      this.$router.push({
        path: "/goods",
      });
    },
    goDetail(id) {
      this.$router.push({
        path: "/goods/details",
        query: {
          id,
        },
      });
    },
  },
  created() {},
  mounted() {},
};
</script>
<style lang="less" scoped>
@import "./index.less";
</style>
